<template>
  <div style="text-align: left">
    发药
  </div>
  <hr/>
  <div style="text-align: left">
    <el-form :inline="true" :model="formChecking">
      <el-form-item label="病历号">
        <el-input  placeholder="请输入患者病历号" clearable  v-model="formChecking.caseNumber"/>
      </el-form-item>
      <el-form-item label="患者姓名">
        <el-input  placeholder="请输入患者姓名" clearable v-model="formChecking.realName"/>
      </el-form-item>
      <el-form-item>
        <el-button type="success" @click="queryRegList">查询</el-button>
      </el-form-item>

    </el-form>
  </div>
  <hr/>
  <el-table :data="regList" style="width: 100%">
    <el-table-column prop="id" label="编号" width="180" />
    <el-table-column prop="realName" label="患者姓名" width="180" />
    <el-table-column prop="caseNumber" label="病历号" />
    <el-table-column prop="age" label="患者年龄" />
    <el-table-column prop="gender" label="性别" />
    <el-table-column>
      <template #default="{row}">
       <el-button @click="queryRegDrugList(row)">显示药品</el-button>
      </template>
    </el-table-column>

  </el-table>
  <hr/>

  <el-table
      :data="regDrugList"
      style="width: 100%">

    <el-table-column prop="drugCode" label="药品编号" />
    <el-table-column prop="drugName" label="药品名称" />
    <el-table-column prop="drugFormat" label="药品规格"/>
    <el-table-column prop="drugUnit" label="包装"/>
    <el-table-column prop="manufacturer" label="生产厂家"/>
    <el-table-column prop="drugPrice" label="单价" width="100"/>

    <el-table-column prop="drugNumber" label="数量"/>

    <el-table-column width="180" >
      <template #default="{row}">
        <el-button type="primary" @click="sendDrug(row)" :disabled="row.isFlag">发药</el-button>
      </template>
    </el-table-column>

  </el-table>
</template>

<script setup>
//定义输出患者查询列表的表单
import {reactive,ref} from "vue";
import axios from "axios";
import {ElMessage} from "element-plus";
//定义输出患者查询列表的表单
const formChecking=reactive({
  caseNumber:'10005731',
  realName:''
});

//定义患者列表
const regList=ref([]);
//定义分页查询中数据总记录数
const total=ref();
//定义病人药品列表集合
const regDrugList=ref([

]);
/*发送根据病历号和或者姓名查询正在进行患者列表*/
function queryRegList(){
  axios.post("http://localhost/his/queryDrugRegList",formChecking)
      .then((response)=>{
        regList.value=response.data.visitedList;
        total.value=response.data.total;

      })
      .catch((error)=>{
        console.log(error);
      });
}

/*发送ajax请求查询患者的药品列表*/
function queryRegDrugList(row){
  axios.get("http://localhost/his/queryRegDurgList?registerId="+row.id)
      .then((response)=>{

        regDrugList.value=response.data;
        regDrugList.value.forEach((item)=>{
          //每行json对象扩展isFlag属性
          item.isFlag=item.drugState=='已发药'?true:false;
        })
      })
      .catch((error)=>{
        console.log(error);
      });
}
//控制发药按钮是否能点击
//const isFlag=ref(false);

/*定义函数，发送ajax请求，实现药房发药*/
function sendDrug(row){
  //console.log(row.id+"===="+row.pid+"===="+row.drugState);
  axios.get("http://localhost/his/sendDrugInfo?pid="
      +row.pid+"&did="+row.id+"&drugNumber="+row.drugNumber)
      .then((response)=>{
        //发药按钮点击完成后，不能在点击
        row.isFlag=true;
        ElMessage(response.data.msg);
      })
      .catch((error)=>{
        console.log(error);
      });
}


</script>

<style scoped>

</style>